<template>
  <view class="smart-page">
    <!-- 页面标题头begin-->
    <view class="smart-page-head">
      <view class="smart-page-head-title">switch开关</view>
    </view>
    <!-- 页面标题头end-->
    <view>默认样式</view>
    <view>
      <switch @change="switch1Change"></switch>
      <switch checked="true"></switch>
    </view>
    <view>颜色、大小改变</view>
    <view>
      <switch color="#4CD964" class="mini_switch"></switch>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
    }
  },
  methods: {
    /*打开开关*/
    switch1Change(e) {
      console.log('switch1当前值: ' + e.detail.value);
    }
  }
}
</script>

<style>
.mini_switch {
  transform: scale(0.7);
}
</style>